import React, { Component } from 'react'
import { connect } from 'react-redux'
// 柯里化函数
// connect  高阶组件  把当前组件和react-redux进行关联

class Home extends Component {
    render() {
        const { count, add } = this.props
        return (
            <div>
                我是Home -- {count}
                <button onClick={ add }>修改count</button>
            </div>
        )
    }
}





// 映射  state数据  去  当前组件的props上
let mapStateToProps = (state) => {
    const { count } = state
    // 这里面return的内容就是往组件的props上添加的内容
    return {
        count
    }
}

// 映射 修改redux中数据的方法 去  当前组件的props上
// !使用mapDispatchToProps后 不会在props上添加dispatch函数
let mapDispatchToProps = (dispatch) => {
    // 这里面return的内容就是往组件的props上添加的方法
    return {
        add() {
            dispatch({ type: "COUNT_ADD" })
        }
    }
}

Home = connect(mapStateToProps, mapDispatchToProps)(Home)

export default Home
